<template>
	<template v-if="problem">
		<problem :problem="problem"></problem>

		<hr>

		<submit-code :submit="submit" :close="close" 
			:run-id="runId" :message="message"></submit-code>
	</template>
</template>


<script type="module">
import problem from '@/components/Problem.vue';
import submitCode from '@/components/SubmitCode.vue';

import { UserService, ProblemService } from '@/common/common.object';

export default {
	data() {
		return {
			problem: null,

			runId: null,
			message: null,
		};
	},
	components: {
		problem,
		submitCode,
	},
	created() {
		ProblemService.get(this.$route.params.id).then(result => {
			this.problem = ProblemService.process(result);
		}).then(() => {
			this.$changeTitle(this.problem.finalTitle);
		});
	},
	methods: {
		submit(lang, code) {
			if (!lang || !code) return;

			this.message = null;

			UserService.checkLogin().then(() => {
				ProblemService.submit(this.problem.id, lang, code)
					.then(result => {
						this.runId = result;
					}).catch(error => {
						this.message = error;
					});
			}).catch(error => this.message = "请先登录!")
		},
		close() {
			this.runId = null;

			return false;
		},
	}
}
</script>


<style scoped>
hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	border-top: 1px solid #eee;
	opacity: unset;
}
</style>
